<template>
       <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple" @grid-ready="gridReady"  class='ag-theme-alpine'
     style="height:90%"  :defaultColDef="defaultColDef" :rowData="table.dataList" 
        :columnDefs="cfsValue" :localeText="localeTextData"/>
      <paginationCopys :total="total" show-total show-jumper 
            show-page-size @change="changePage"    
            @page-size-change="changeSize" 
            style="justify-content: center;margin: 10px 0px 10px 0px;"  
            :page-size="pagination.pageSize" :current="pagination.page" />                
</template>
<script lang="ts">
import { reactive, ref,onMounted } from 'vue'
import { useTable, useRowKey, useTableColumn, usePagination, useRowSelection } from '@/hooks/table'

import { localeText } from '@/api/aggridZw'
import emitter from "@/hooks/useEventBus";
export default {
    name:'widthPhyWordProce',
    setup(){
        let searchData = {};
        onMounted(() => {
            // 第一个页面需要在刚进入就调用一次  切换tap时也需要调用
            doRefresh();
            emitter.on("refresh-widthPhyWordProce", () => {
                doRefresh();
            });
        });
        //表格方面
        const doRefresh = () => { };
        const gridOption = ref();
        const table = useTable();
        const gridReady = (params:any) => {
          gridOption.value = params.api;
          //调整表格自适应大小
        //   gridOption.value.sizeColumnsToFit(); 
        }
        const defaultColDef = {
            sortable: true,
            resizable: true,
            filter: true,
            flex: 1
        };
        const cfsValue = [
            {
                headerName: "工段",
                field: "depart",
            },
            {
                headerName: "工序",
                field: "depart",
            },
            {
                headerName: "工序计划开始时间",
                field: "depart",
            },
            {
                headerName: "工序计划完成时间",
                field: "depart",
            },
            {
                headerName: "实际工序开始时间",
                field: "depart",
            },
            {
                headerName: "实际工序结束时间",
                field: "depart",
            },
            {
                headerName: "匹数",
                field: "depart",
            },
            {
                headerName: "重量",
                field: "depart",
            },
            {
                headerName: "米数",
                field: "depart",
            },
            {
                headerName: "作业性质",
                field: "depart",
            },
            {
                headerName: "设备编号",
                field: "depart",
            },
        ];
       
        const pagination = usePagination(doRefresh);
        const total = ref(10);
        const changePage = (val:any) => {
            pagination.page = val
            doRefresh();
        }
        const changeSize = (val:any) => {
            pagination.pageSize = val
            doRefresh();
        }

        const localeTextData :any = ref(localeText);
        return {
            changePage,
            changeSize,
            localeTextData,
            defaultColDef,
            gridReady,
            cfsValue,
            total,
            pagination,
            table
        }
    },
    components:{  }
}
</script>
<style lang="less" scoped>
    
</style>